<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>填写贷款</title>
    <script th:src="@{/script/jquery-1.12.4.js}"></script>
    <link rel="stylesheet" th:href="@{/css/bootstrap.css}"/>
    <link rel="stylesheet" th:href="@{/css/apply.css}"/>
    <script th:src="@{/script/bootstrap.js}"></script>
    <script th:src="@{/bootstrap/js/city-picker.data.js}"></script>
    <script th:src="@{/bootstrap/js/city-picker.js}"></script>
    <link rel="stylesheet" th:href="@{/bootstrap/css/city-picker.css}" type="text/css"/>
    <link rel="stylesheet" th:href="@{/css/bootstrapValidator.css}"/>
    <link rel="stylesheet" th:href="@{/css/bootstrapValidator.min.css}"/>
    <script th:src="@{/script/bootstrapValidator.min.js}"></script>
    <link rel="stylesheet" th:href="@{/css/common.css}"/>
    <link rel="stylesheet" th:href="@{/css/index.css}" type="text/css">
    <script th:src="@{/script/common.js}" type="text/javascript"></script>
    <script th:src="@{/script/vue.min.js}" type="text/javascript"></script>
    <script th:src="@{/script/axios.min.js}" type="text/javascript"></script>
    <script type="text/javascript">
        // 上下滚动
        function AutoScroll(obj) {
            $(obj).find("ul:first").animate({
                    marginTop: "-25px"
                },
                500,
                function () {
                    $(this).css({
                        marginTop: "0px"
                    }).find("li:first").appendTo(this);
                });
        }

        $(document).ready(function () {
            var myar = setInterval('AutoScroll("#scrollDiv")', 3000);
            $("#scrollDiv").hover(function () {
                    clearInterval(myar);
                },
                function () {
                    myar = setInterval('AutoScroll("#scrollDiv")', 3000)
                }); //当鼠标放上去的时候，滚动停止，鼠标离开的时候滚动开始
        });
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div th:replace="loan/public::head"></div>
    </div>
    <div class="row">
        <a style="text-decoration: none;
    margin-left: 202px;
    margin-top: 55px;
    display: inline-block;" th:href="@{/loan/loanmian}">首页 > <a style="text-decoration: none;" th:href="@{/loan/credit_3}">业主贷 > </a><a
                style="text-decoration: none;" th:href="@{/loan/agreeapply3}">填写贷款申请 > </a><span style="color: #D0D0D0">填写房信息<span>
        <div class="creditapply">
            <h3 class="xiangqing">填写房信息</h3>
            <div>
                <form class="form-horizontal" enctype="multipart/form-data" id="form" method="post" style="margin-left: 218px;
}" th:action="@{/loan/houseadd}">
                    <div class="loanright" style=" float: left;margin-top: 40px;
    width: 490px;">
                        <div id="distpicker" style="margin-left: 14px;">
                            <div class="form-group">
                                <label>所在城市</label>
                                <div style="position: relative;    text-align:-webkit-center;left: 19px;">
                                    <input class="form-control" data-toggle="city-picker" id="address" name="houseaddress" placeholder="所在城市" readonly
                                           type="text">
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">详细地址</label>
                            <div class="col-md-6">
                                <textarea class="form-control" name="housedata" rows="3" style="width: 330px"></textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">拥有房的时间</label>
                            <select class="combobox" name="housedate" style="margin-left: 16px;">
                                <option value="<6个月"><6个月</option>
                                <option value="6个月~12个月">6个月~12个月</option>
                                <option value=">12个月">>12个月</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">房产证明</label>
                            <div class="col-md-6">
                                <input name="pfile" type="file"/>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-6 col-md-offset-2">
                            <button class="btn btn-primary" id="btn" style="margin-left: 125px;
    margin-bottom: 40px;" type="submit">保存</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <!--网站底部-->
    <div th:replace="common/public::footer"></div>
</div>
</div>
</body>

<script type="text/javascript">
    window.onload = function () {
        $("#form").bootstrapValidator({
            //默认提示
            message: 'This value is not valid',
            // 表单框里右侧的icon
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            submitHandler: function (validator, form, submitButton) {
                console.log(1);
                // 表单提交成功时会调用此方法
                // validator: 表单验证实例对象
                // form jq对象 指定表单对象
                // submitButton jq对象 指定提交按钮的对象
            },
            fields: {
                houseaddress: {
                    message: '所在地址验证失败',
                    validators: {
                        notEmpty: {   //不能为空
                            message: '所在地址不能为空'
                        }
                    }
                },
                housedata: {
                    message: '详细地址验证失败',
                    validators: {
                        notEmpty: {   //不能为空
                            message: '详细地址不能为空'
                        },
                        remote: {
                            url: '/erb/loan/houseisnull',//验证地址
                            message: '房信息已存在',//提示消息
                            type: 'POST'//请求方式
                        }
                    },
                },
                pfile: {
                    validators: {
                        notEmpty: {
                            message: '上传图片不能为空'
                        },
                        file: {
                            extension: 'png,jpg,jpeg',
                            type: 'image/png,image/jpg,image/jpeg',
                            message: '请重新选择图片'
                        }
                    }
                }
            }
        });
    }

</script>

</html>